<!DOCTYPE HTML>
<!--
	Astral 2.5 by HTML5 UP
	html5up.net | @n33co
	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
	<head>
		<title>Astral by HTML5 UP</title>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
		<meta name="description" content="" />
		<meta name="keywords" content="" />
		<link href="http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400" rel="stylesheet" />
		<script src="js/jquery.min.js"></script>
		<script src="js/skel.min.js"></script>
		<script src="js/init.js"></script>
		<noscript>
			<link rel="stylesheet" href="css/skel-noscript.css" />
			<link rel="stylesheet" href="css/style.css" />
			<link rel="stylesheet" href="css/style-desktop.css" />
			<link rel="stylesheet" href="css/noscript.css" />
		</noscript>
		<!--[if lte IE 8]><script src="js/html5shiv.js"></script><link rel="stylesheet" href="css/ie8.css" /><![endif]-->
	</head>
	<body class="homepage">

		<!-- Wrapper-->
			<div id="wrapper">
				
				<!-- Nav -->
					<nav id="nav">
						<a href="#me" class="fa fa-home active"><span>Home</span></a>
						<a href="#work" class="fa fa-folder"><span>Work</span></a>
						<a href="#portfolio" class="fa fa-desktop"><span>Portfolio</span>
						<a href="#email" class="fa fa-envelope"><span>Email Me</span></a>
					</nav>

				<!-- Main -->
					<div id="main">
						
						<!-- Me -->
							<article id="me" class="panel">
								<header>
									<h1 style="color: #2F4F4F; font-weight:bold;">Dika Meylia Fitri</h1>
									<span class="byline">Health Service Executive</span>
								</header>
								<a href="#work" class="jumplink pic">
									<span class="jumplink arrow fa fa-chevron-right"><span>See my work</span></span>
									<img style="border-radius:100%" src="images/me.jpg" alt="" />
								</a>
							</article>

						<!-- Work --> 
							<article id="work" class="panel">
								<header>
									<h2>Work</h2>
								</header>
								<p>
									Phasellus enim sapien, blandit ullamcorper elementum eu, condimentum eu elit. 
									Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia 
									luctus elit eget interdum.
								</p>
								<section class="is-gallery">
									<div class="row half">
										<div class="4u">
											<a href="http://flypixel.com/knob/3495684098026313" class="image image-full"><img src="images/1.jpg" alt=""></a>
										</div>
										<div class="4u">
											<a href="http://flypixel.com/contact-login-form/8829734266026310" class="image image-full"><img src="images/2.jpg" alt=""></a>
										</div>
										<div class="4u">
											<a href="http://flypixel.com/wallpaper-pack/3755398966026313" class="image image-full"><img src="images/3.jpg" alt=""></a>
										</div>
									</div>
									<!--<div class="row half">
										<div class="4u">
											<a href="http://flypixel.com/44-shades-of-free-icons/8268508056006318" class="image image-full"><img src="images/4.jpg" alt=""></a>
										</div>
										<div class="4u">
											<a href="http://flypixel.com/flip-clock/3655053956026317" class="image image-full"><img src="images/5.jpg" alt=""></a>
										</div>
										<div class="4u">
											<a href="http://flypixel.com/dropdown/5290304620795313" class="image image-full"><img src="images/6.jpg" alt=""></a>
										</div>
									</div>
									<div class="row half">
										<div class="4u">
											<a href="http://flypixel.com/pie-charts/1759361594616314" class="image image-full"><img src="images/7.jpg" alt=""></a>
										</div>
										<div class="4u">
											<a href="http://flypixel.com/sliding-selector-bar/7042935581006315" class="image image-full"><img src="images/8.jpg" alt=""></a>
										</div>
										<div class="4u">
											<a href="http://flypixel.com/dark-as-hell-ui/5418809286006313" class="image image-full"><img src="images/9.jpg" alt=""></a>
										</div>
									</div>
									<div class="row half">
										<div class="4u">
											<a href="http://flypixel.com/cityscape/9803996277226316" class="image image-full"><img src="images/10.jpg" alt=""></a>
										</div>
										<div class="4u">
											<a href="http://flypixel.com/dropdown/8259263378026313" class="image image-full"><img src="images/11.jpg" alt=""></a>
										</div>
										<div class="4u">
											<a href="http://flypixel.com/wood-ui-kit/3574765984616310" class="image image-full"><img src="images/12.jpg" alt=""></a>
										</div>
									</div>
									<div class="row half">
										<div class="4u">
											<a href="http://flypixel.com/upload-button/9737964647895311" class="image image-full"><img src="images/13.jpg" alt=""></a>
										</div>
										<div class="4u">
											<a href="http://flypixel.com/collapsible-menunavigation/5743165610406316" class="image image-full"><img src="images/14.jpg" alt=""></a>
										</div>
										<div class="4u">
											<a href="http://flypixel.com/3d-button/5506786525606318" class="image image-full"><img src="images/15.jpg" alt=""></a>
										</div>
									</div>-->
								</section>
							</article>
					<!-- Portofolio --> 
							<article id="portfolio" class="panel">
								<header>
									<h2>Portfolio</h2>
								</header>
								<p>
									Phasellus enim sapien, blandit ullamcorper elementum eu, condimentum eu elit. 
									Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia 
									luctus elit eget interdum.
								</p>
								<section class="is-gallery">

								</section>
							</article>
						<!-- Email -->
							<article id="email" class="panel">
								<header>
									<h2>Email Me</h2>
								</header>
								<form action="mailto:dicha.meylia@yahoo.com method="post">
									<div>
										<div class="row half">
											<div class="6u">
												<input type="text" class="text" name="name" placeholder="Name" />
											</div>
											<div class="6u">
												<input type="text" class="text" name="email" placeholder="Email" />
											</div>
										</div>
										<div class="row half">
											<div class="12u">
												<input type="text" class="text" name="subject" placeholder="Subject" />
											</div>
										</div>
										<div class="row half">
											<div class="12u">
												<textarea name="message" placeholder="Message"></textarea>
											</div>
										</div>
										<div class="row">
											<div class="12u">
												<input type="submit" class="button" value="Send Message" />
											</div>
										</div>
									</div>
								</form>
							</article>

					</div>
		
				<!-- Footer -->
					<div id="footer">
							<h3><span style="color: #FFFFFF; font-size: 32px; font-weight:bold;">find me on...</span></h3>
							<ul class="social">
								<li class="twitter"><a href="http://twitter.com/febrinata23" target="_blank" class="fa fa-twitter"><span>Twitter</span></a></li>
								<li class="facebook"><a href="http://facebook.com/kaziz.febrinata" target="_blank" class="fa fa-facebook"><span>Facebook</span></a></li>
								<li class="dribbble"><a href="http://dribbble.com/n33" class="fa fa-dribbble"><span>Dribbble</span></a></li>
								<li class="linkedin"><a href="#" class="fa fa-linkedin"><span>LinkedIn</span></a></li>
								<li class="tumblr"><a href="#" class="fa fa-tumblr"><span>Tumblr</span></a></li>
								<li class="googleplus"><a href="https://plus.google.com/+kazizfebrinata" target="_blank" class="fa fa-google-plus"><span>Google+</span></a></li>
								<li class="github"><a href="http://github.com/febrinata23" target="_blank" class="fa fa-github"><span>Github</span></a></li>
							</ul>
					</div>
		
			</div>

	</body>
</html>